import '@abraham/reflection'
import { createApp,KeepAlive, Transition } from 'vue'
import { RouterView,RouteLocationNormalized } from 'vue-router'
import { Component, VueComponent } from 'vue3-oop'

import AppSercice from "@/service/AppService";
import SettingService from "@/service/SettingService";
import RouterService,{ RouterInit } from "@/service/RouterService";
import GlobalProvider from '@/components/global/GlobalProvider'
import setup from '@/setup'

import '@/assets/styles/index.scss';

import { NRow,NCol } from 'naive-ui';

@Component({
  providers: [
    RouterInit, RouterService, AppSercice, SettingService
  ]
})
class App extends VueComponent {
  render() {
    return (
      <GlobalProvider>
        <RouterView>
          {{
            default: ({ Component,route }: { Component: any,route: RouteLocationNormalized }) => {
              if(Component){
                let innerComponent = <Component key={route.fullPath} is={Component}/>
                if(import.meta.env.PROD && route.meta.keepAlive){
                  innerComponent = <KeepAlive>{innerComponent}</KeepAlive>;
                }
                return (<Transition name="fade" mode={'out-in'}>{innerComponent}</Transition>)
              }
              return null;
            }
          }}
        </RouterView>
      </GlobalProvider>
    )
  }
}

const app = createApp(App)
// app.config.warnHandler=()=>null;
setup(app)
app.component('n-row',NRow);
app.component('n-col',NCol);
app.mount('#app')

console.log(import.meta.env)